<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Operate Group Example</title>
    <script src="./jquery-1.12.1.js"></script>
    <script src="./socket.io.js"></script>
    <script>
        $(document).ready(function(){
			$.get({
				url: "http://59.110.5.217:30014/splitter/enzyme",
				success: function (data) {
					console.log(data);
				
					if(data.code != 0){
						return;
					}
					
					var wsUrl = data.data;
			
					var ws = new WebSocket(wsUrl);
					ws.onopen = WSonOpen;
					ws.onmessage = WSonMessage;
					ws.onclose = WSonClose;
					ws.onerror = WSonError;

					function WSonOpen() {
						Log("连接已经建立。", "OK");
						$("#message").append("<h4>初始化：</h4>");
					};

					function WSonMessage(event) {
						$("#message").append("<h4>来自服务端消息："+event.data+"</h4>");
						Log(event.data);
					};

					function WSonClose() {
						Log("连接关闭。", "ERROR");
					};


					function WSonError() {
						Log("WebSocket错误。", "ERROR");
					};

					function Log(mes){
						console.log(mes);
					}
					
					$("#btnCreate").click(function(){
						var createGroupCommand = {
							"command":"createGroup",
							"version":"0.1",
							"id":"b5265010-bb7a-11e6-a60f-77d95c87b19f",
							"data": {
								"name":"b_group",
								"users":[
								  "zzgghh","zzgghh2","zzgghh3"
								],
								"clientNature":"enzyme",//创建群组的系统，如enzyme
							}
						}
						console.log(createGroupCommand);
						ws.send(JSON.stringify(createGroupCommand));
					});
					
					$("#btnDissolve").click(function(){
						var dissolveGroupCommand = {
							"command":"dissolveGroup",
							"version":"0.1",
							"id":"b5265010-bb7a-11e6-a60f-77d95c87b19f",
							"data": {
								"groupId":"3"
							}
						}
						console.log(dissolveGroupCommand);
						ws.send(JSON.stringify(dissolveGroupCommand));
					});
					
					$("#btnUpdateInfo").click(function(){
						var updateGroupInfoCommand = {
							"command":"updateGroup",
							"version":"0.1",
							"id":"b5265010-bb7a-11e6-a60f-77d95c87b19f",
							"data": {
								"groupId":"6",
								"name":$("#groupName").val()
							}
						}
						console.log(updateGroupInfoCommand);
						ws.send(JSON.stringify(updateGroupInfoCommand));
					});
					
					$("#btnQueryInfo").click(function(){
						var updateGroupInfoCommand = {
							"command":"queryGroupInfo",
							"version":"0.1",
							"id":"b5265010-bb7a-11e6-a60f-77d95c87b19f",
							"data": {
								"groupId":"6"
							}
						}
						console.log(updateGroupInfoCommand);
						ws.send(JSON.stringify(updateGroupInfoCommand));
					});
					
					$("#btnModifyGroupMeb").click(function(){
						var updateGroupInfoCommand = {
							"command":"modifyGroupMembers",
							"version":"0.1",
							"id":"b5265010-bb7a-11e6-a60f-77d95c87b19f",
							"data":{
							  "groupId":"12",
							  "users":[{
								"user":"55555",
								"action":"remove"
							   },{
								"user":"77777",
								"action":"quit"
							   },{
								"user":"99999",
								"action":"add"
							   }]
							}
						}
						console.log(updateGroupInfoCommand);
						ws.send(JSON.stringify(updateGroupInfoCommand));
					});
				},
				error:function() {
					return alert("系统异常,获取用户信息失败");
				}
			});
			
        });
    </script>
</head>
<body>
<div id="message">

</div>
<div>
	<button id="btnCreate">创建群组</button>
	<button id="btnDissolve">解散群组</button><br/>
	名称：<input id="groupName"><br/><button id="btnUpdateInfo">修改群组名称</button>
	<button id="btnQueryInfo">查询群组信息</button>
	<button id="btnModifyGroupMeb">修改群组成员</button>
</div>
</body>
</html>